<template>
  <div class="not-found">
    <h1>404 not found!</h1>
    <button v-if="backText" @click="backHome">{{ backText }}</button>
  </div>
</template>
<script lang="ts" setup>
defineProps({
  backText: {
    default: "",
  },
});
const emits = defineEmits(["backHome"]);
const backHome = () => {
  emits("backHome");
};
</script>
<style scoped>
.not-found {
  text-align: center;
}
h1 {
  font-size: 42px;
  font-style: italic;
  padding: 10% 0 20px 0;
}
</style>
